<template>
  <div class="row">
    <div class="row title">button按钮 <span class="gray">（基于原生button封装）</span></div>
    <div class="row">
      <div class="row">基础</div>
      <div class="btn-template">
        <dw-button type="default" v-debounce:1000="demo.bind(this, 1)">default</dw-button>
        <dw-button type="primary" v-throttle:500="demo">primary</dw-button>
        <dw-button type="success">success</dw-button>
        <dw-button type="info">info</dw-button>
        <dw-button type="warning" waiting>warning waiting</dw-button>
        <dw-button type="danger" loading>danger loading</dw-button>
        <dw-button type="text">text</dw-button>
      </div>
    </div>
    <div class="row">
      <div class="row">禁用</div>
      <div class="btn-template">
        <dw-button disabled type="default">default</dw-button>
        <dw-button disabled type="primary">primary</dw-button>
        <dw-button disabled type="success">success</dw-button>
        <dw-button disabled type="info">info</dw-button>
        <dw-button disabled type="warning">warning</dw-button>
        <dw-button disabled type="danger">danger</dw-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    demo(val = 111) {
      console.log(val);
    },
  },
};
</script>

<style scoped>
.gray {
  font-size: 0.7em;
  color: #999;
}
.row {
  margin-bottom: 20px;
}
.btn-template > button {
  margin: 0 20px 20px 0;
}
</style>
